jrfnl /
PHP-cheat-sheet-extended
| Conditions | 1 |
| Paths | 36 |
| Total Lines | 268 |
| Lines | 0 |
| Ratio | 0 % |
| Changes | 1 | ||
| Bugs | 0 | Features | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
| 1 | /* Javascript interaction for PHP cheat sheets. */ |
||
| 2 | jQuery( document ).ready( function() { |
||
| 3 | |||
| 4 | /** |
||
| 5 | * Declare variables. |
||
| 6 | */ |
||
| 7 | var myAccordion, phpvForm, myTabs, formTabField, windowTitle, tabPanels; |
||
|
|
|||
| 8 | |||
| 9 | |||
| 10 | /** |
||
| 11 | * Collapsible notes/legend at top of page. |
||
| 12 | */ |
||
| 13 | myAccordion = jQuery( '#accordion' ); |
||
| 14 | myAccordion.accordion({ |
||
| 15 | active: false, |
||
| 16 | collapsible: true, |
||
| 17 | icons: { |
||
| 18 | header: 'ui-icon-circle-arrow-e', |
||
| 19 | activeHeader: 'ui-icon-circle-arrow-s' |
||
| 20 | }, |
||
| 21 | heightStyle: 'content' |
||
| 22 | }); |
||
| 23 | |||
| 24 | |||
| 25 | /** |
||
| 26 | * Add auto-submit to php version dropdown. |
||
| 27 | */ |
||
| 28 | phpvForm = jQuery( '#choose-version' ); |
||
| 29 | phpvForm.on( 'change', 'select', function() { |
||
| 30 | phpvForm.submit(); |
||
| 31 | }); |
||
| 32 | |||
| 33 | |||
| 34 | /** |
||
| 35 | * Tabbed interface. |
||
| 36 | */ |
||
| 37 | myTabs = jQuery( '#tabs' ); |
||
| 38 | formTabField = jQuery( '#phpv-tab' ); |
||
| 39 | windowTitle = jQuery( 'title' ); |
||
| 40 | |||
| 41 | myTabs.tabs({ |
||
| 42 | beforeActivate: function( event, ui ) { |
||
| 43 | /* Remove floating table headers from old panel. */ |
||
| 44 | var oldId = ui.oldPanel.find( 'table' ).attr( 'id' ); |
||
| 45 | if ( oldId ) { |
||
| 46 | jQuery( '#' + oldId ).thfloat( 'destroy' ); |
||
| 47 | } |
||
| 48 | }, |
||
| 49 | activate: function( event, ui ) { |
||
| 50 | var tableId, tabHref, tabTab, tabTitle, oldTab, oldTitle, titleText; |
||
| 51 | var oldTabNoUnderscore, oldTitlePre, oldUri; |
||
| 52 | |||
| 53 | /* (Re-)attach floating table headers for activated panel. */ |
||
| 54 | tableId = ui.newPanel.find( 'table' ).attr( 'id' ); |
||
| 55 | if ( tableId ) { |
||
| 56 | jQuery( '#' + tableId ).thfloat({ |
||
| 57 | side: 'head', |
||
| 58 | onShow: function( table, block ) { |
||
| 59 | |||
| 60 | // Remove hover and sticky classes as they will otherwise not stay consistent. |
||
| 61 | block.find( 'th' ).css( 'background', '' ); |
||
| 62 | } |
||
| 63 | }).thfloat({ |
||
| 64 | side: 'foot', |
||
| 65 | onShow: function( table, block ) { |
||
| 66 | |||
| 67 | // Remove hover and sticky classes as they will otherwise not stay consistent. |
||
| 68 | block.find( 'th' ).css( 'background', '' ); |
||
| 69 | } |
||
| 70 | }); |
||
| 71 | } |
||
| 72 | |||
| 73 | /* Remove hover and sticky classes as they will otherwise not stay consistent. */ |
||
| 74 | jQuery( '.hover, .sticky' ).removeClass( 'hover sticky' ); |
||
| 75 | |||
| 76 | |||
| 77 | /* Change the location bar url to the selected tab to enable reloading to the currently |
||
| 78 | selected tab and avoid the location bar change causing the page to reload. */ |
||
| 79 | tabHref = ui.newTab.find( 'a' ).attr( 'href' ); |
||
| 80 | tabTab = ui.newTab.find( 'a' ).attr( 'data-tab' ); |
||
| 81 | tabTitle = ui.newTab.find( 'a' ).attr( 'data-tab-title' ); |
||
| 82 | if ( tabHref && tabTab && tabTitle ) { |
||
|
1 ignored issue
–
show
|
|||
| 83 | oldTab = ui.oldTab.find( 'a' ).attr( 'data-tab' ); |
||
| 84 | oldTitle = ui.oldTab.find( 'a' ).attr( 'data-tab-title' ); |
||
| 85 | |||
| 86 | titleText = windowTitle.text(); |
||
| 87 | |||
| 88 | if ( titleText.indexOf( ':: ' + oldTitle ) !== -1 ) { |
||
| 89 | titleText = titleText.replace( ':: ' + oldTitle, ':: ' + tabTitle ); |
||
| 90 | } |
||
| 91 | else { |
||
| 92 | oldTabNoUnderscore = oldTab.replace( '_', ' ' ); |
||
| 93 | if ( titleText.indexOf( ':: ' + oldTabNoUnderscore ) !== -1 ) { |
||
| 94 | titleText = titleText.replace( ':: ' + oldTabNoUnderscore, ':: ' + tabTitle ); |
||
| 95 | } |
||
| 96 | // This was a generic call, no previous tab selected. |
||
| 97 | else { |
||
| 98 | oldTitlePre = titleText.substring( 0, titleText.indexOf( ' Cheatsheet for ' ) ); |
||
| 99 | titleText = oldTitlePre + titleText.replace( oldTitlePre, ( ' :: ' + tabTitle ) ); |
||
| 100 | } |
||
| 101 | } |
||
| 102 | |||
| 103 | // Static sheets. |
||
| 104 | if ( '#' === tabHref.substring( 0, 1 ) ) { |
||
| 105 | oldUri = window.location.href; |
||
| 106 | if ( oldUri.indexOf( '#' ) !== -1 && window.location.hash === ( '#' + oldTab ) ) { |
||
| 107 | tabHref = oldUri.replace( window.location.hash, tabHref ); |
||
| 108 | } |
||
| 109 | else { |
||
| 110 | tabHref = oldUri + tabHref; |
||
| 111 | } |
||
| 112 | } |
||
| 113 | // Dynamic sheet. |
||
| 114 | else { |
||
| 115 | tabHref = tabHref.substring( 0, ( tabHref.indexOf( '/ajax' ) + 1 ) ); |
||
| 116 | } |
||
| 117 | |||
| 118 | // Add to history. |
||
| 119 | history.pushState( null, titleText, tabHref ); |
||
|
1 ignored issue
–
show
|
|||
| 120 | // Change the title bar title. |
||
| 121 | windowTitle.text( titleText ); |
||
| 122 | // Change the tab value for the php version dropdown. |
||
| 123 | formTabField.val( tabTab ); |
||
| 124 | } |
||
| 125 | }, |
||
| 126 | beforeLoad: function( event, ui ) { |
||
| 127 | if ( '' === ui.panel.html() ) { |
||
| 128 | // Show spinner if tab hasn't been loaded yet. |
||
| 129 | ui.panel.html( '<div class="spinner"> </div>' ); |
||
| 130 | // Show error message if ajax loading of content failed. |
||
| 131 | ui.jqXHR.error(function() { |
||
| 132 | ui.panel.html( 'An error occurred while loading the table. Please try again. If it keeps failing, please inform the site owner.' ); |
||
| 133 | }); |
||
| 134 | return true; |
||
| 135 | } |
||
| 136 | // Ok, html has already loaded, no need to request it again. |
||
| 137 | return false; |
||
| 138 | }, |
||
| 139 | cache: true, |
||
| 140 | create: function( event, ui ) { |
||
| 141 | var tabTitle, titleText, oldTitlePre; |
||
| 142 | |||
| 143 | /* Set the initial tab value for the dropdown and title bar |
||
| 144 | Static sheets only (they are the only ones with location hashes). */ |
||
| 145 | var tabHash = window.location.hash; |
||
| 146 | if ( tabHash && '' !== tabHash ) { |
||
| 147 | // Change the initial tab value for the php version dropdown. |
||
| 148 | if ( '' === formTabField.val() ) { |
||
| 149 | formTabField.val( tabHash.replace( '#', '' ) ); |
||
| 150 | } |
||
| 151 | // Add the tab title to the initial window titlebar title. |
||
| 152 | tabTitle = ui.tab.find( 'a' ).attr( 'data-tab-title' ); |
||
| 153 | titleText = windowTitle.text(); |
||
| 154 | oldTitlePre = titleText.substring( 0, titleText.indexOf( ' Cheatsheet for ' ) ); |
||
| 155 | titleText = oldTitlePre + titleText.replace( oldTitlePre, ( ' :: ' + tabTitle ) ); |
||
| 156 | windowTitle.text( titleText ); |
||
| 157 | } |
||
| 158 | }, |
||
| 159 | load: function( event, ui ) { |
||
| 160 | /* Attach floating table headers for panel loaded via Ajax. */ |
||
| 161 | var tableId = ui.panel.find( 'table' ).attr( 'id' ); |
||
| 162 | jQuery( '#' + tableId ).thfloat({ |
||
| 163 | side: 'head', |
||
| 164 | onShow: function( table, block ) { |
||
| 165 | // Remove hover and sticky classes as they will otherwise not stay consistent. |
||
| 166 | block.find( 'th' ).css( 'background', '' ); |
||
| 167 | } |
||
| 168 | }).thfloat({ |
||
| 169 | side: 'foot', |
||
| 170 | onShow: function( table, block ) { |
||
| 171 | // Remove hover and sticky classes as they will otherwise not stay consistent. |
||
| 172 | block.find( 'th' ).css( 'background', '' ); |
||
| 173 | } |
||
| 174 | }); |
||
| 175 | // Remove hover and sticky classes as they will otherwise not stay consistent. |
||
| 176 | // jQuery( '.thfloat th' ).removeClass( 'hover sticky' ).css( 'background', '' ); |
||
| 177 | } |
||
| 178 | }); |
||
| 179 | |||
| 180 | |||
| 181 | /** |
||
| 182 | * Auto-expand relevant accordion legend section when a link refering to text within the section is clicked. |
||
| 183 | */ |
||
| 184 | myTabs.on( 'click', '.fright a', function() { |
||
| 185 | myAccordion.accordion( 'option', 'active', 1 ); |
||
| 186 | }); |
||
| 187 | |||
| 188 | |||
| 189 | /** |
||
| 190 | * Tooltips for long table column headers. |
||
| 191 | * |
||
| 192 | * @todo improve.... |
||
| 193 | */ |
||
| 194 | jQuery( '.ui-tabs-panel th [title]' ).tooltip({ |
||
| 195 | tooltipClass: 'th-tooltip', |
||
| 196 | content: function() { |
||
| 197 | var element = jQuery( this ); |
||
| 198 | var toolTip; |
||
| 199 | toolTip = element.attr( 'title' ); |
||
| 200 | toolTip = toolTip.replace( /\n/g, '<br />' ); |
||
| 201 | toolTip = toolTip.replace( /\t/g, ' ' ); |
||
| 202 | return toolTip; |
||
| 203 | } |
||
| 204 | }); |
||
| 205 | |||
| 206 | |||
| 207 | /** |
||
| 208 | * Highlight table row and column. |
||
| 209 | */ |
||
| 210 | tabPanels = jQuery( '.ui-tabs-panel' ); |
||
| 211 | tabPanels.on( 'mouseenter', 'td, th', function() { |
||
| 212 | var idx = jQuery( this ).parent().children( 'td,th' ).index( jQuery( this ) ) + 1; |
||
| 213 | var rowIdx = jQuery( this ).parent().parent().children( 'tr' ).index( jQuery( this ).parent() ) + 1; |
||
| 214 | if ( rowIdx > 1 ) { |
||
| 215 | jQuery( this ).parent().addClass( 'hover' ); |
||
| 216 | } |
||
| 217 | if ( idx > 1 ) { |
||
| 218 | jQuery( '.ui-tabs-panel td:nth-child( ' + idx + ' )' ).addClass( 'hover' ); |
||
| 219 | jQuery( '.ui-tabs-panel th:nth-child( ' + idx + ' )' ).addClass( 'hover' ); |
||
| 220 | jQuery( '.thfloat th:nth-child( ' + idx + ' )' ).addClass( 'hover' ); |
||
| 221 | } |
||
| 222 | }); |
||
| 223 | tabPanels.on( 'mouseleave', 'td, th', function() { |
||
| 224 | var idx = jQuery( this ).parent().children( 'td,th' ).index( jQuery( this ) ) + 1; |
||
| 225 | var rowIdx = jQuery( this ).parent().parent().children( 'tr' ).index( jQuery( this ).parent() ) + 1; |
||
| 226 | if ( rowIdx > 1 ) { |
||
| 227 | jQuery( this ).parent().removeClass( 'hover' ); |
||
| 228 | } |
||
| 229 | if ( idx > 1 ) { |
||
| 230 | jQuery( '.ui-tabs-panel td:nth-child( ' + idx + ' )' ).removeClass( 'hover' ); |
||
| 231 | jQuery( '.ui-tabs-panel th:nth-child( ' + idx + ' )' ).removeClass( 'hover' ); |
||
| 232 | jQuery( '.thfloat th:nth-child( ' + idx + ' )' ).removeClass( 'hover' ); |
||
| 233 | } |
||
| 234 | }); |
||
| 235 | |||
| 236 | |||
| 237 | /** |
||
| 238 | * Sticky table row and column highlighting. |
||
| 239 | */ |
||
| 240 | tabPanels.on( 'click', 'td, th', function() { |
||
| 241 | var idx = jQuery( this ).parent().children( 'td,th' ).index( jQuery( this ) ) + 1; |
||
| 242 | var rowIdx = jQuery( this ).parent().parent().children( 'tr' ).index( jQuery( this ).parent() ) + 1; |
||
| 243 | |||
| 244 | var tCells = jQuery( '.ui-tabs-panel td:nth-child( ' + idx + ' )' ); |
||
| 245 | var tHeaders = jQuery( '.ui-tabs-panel th:nth-child( ' + idx + ' )' ); |
||
| 246 | var fHeaders = jQuery( '.thfloat th:nth-child( ' + idx + ' )' ); |
||
| 247 | |||
| 248 | if ( jQuery( this ).parent().hasClass( 'sticky' ) || jQuery( 'td:nth-child( ' + idx + ' )' ).hasClass( 'sticky' ) || jQuery( 'th:nth-child( ' + idx + ' )' ).hasClass( 'sticky' ) ) { |
||
| 249 | if ( rowIdx > 1 ) { |
||
| 250 | jQuery( this ).parent().removeClass( 'sticky' ); |
||
| 251 | } |
||
| 252 | if ( idx > 1 ) { |
||
| 253 | tCells.removeClass( 'sticky' ); |
||
| 254 | tHeaders.removeClass( 'sticky' ); |
||
| 255 | fHeaders.removeClass( 'sticky' ); |
||
| 256 | } |
||
| 257 | } |
||
| 258 | else { |
||
| 259 | if ( rowIdx > 1 ) { |
||
| 260 | jQuery( this ).parent().addClass( 'sticky' ); |
||
| 261 | } |
||
| 262 | if ( idx > 1 ) { |
||
| 263 | tCells.addClass( 'sticky' ); |
||
| 264 | tHeaders.addClass( 'sticky' ); |
||
| 265 | fHeaders.addClass( 'sticky' ); |
||
| 266 | } |
||
| 267 | } |
||
| 268 | }); |
||
| 269 | }); |
||
| 270 |
Loading history...
Since ECMAScript 6, you can create block-scoped vars or constants with the keywords
letorconst. These variables/constants are only valid in the code block where they have been declared.Consider the following two pieces of code:
and
The variable is not defined otuside of its block. This limits bleeding of variables into other contexts.
To know more about this ECMA6 feature, look at the MDN pages on let and const.